<template>
    <a-modal v-model:open="visible.value" title="提醒设置" @cancel="emit('update:modelVisible', false);" width="980px"
        :footer="false">
        <p style="margin: 2% 0 ;"><span style="color: #AAAAAA;">【新建提醒后请添加提醒对象和提醒事项】</span>
            <a-button type="primary" style="float: right;" @click="addRemindModal = true">
                <template #icon>
                    <PlusOutlined />
                </template>
                新增提醒</a-button>
        </p>
        <a-table :columns="columns" :data-source="remindData" bordered :loading="loading">
            <template #bodyCell="{ column, text, record }">
                <template v-if="column.dataIndex === 'name'">
                    <a>{{ text }}</a>
                </template>
                <template v-if="column.dataIndex === 'operation'">
                    <a-space>
                        <a-button type="link" size="small" @click="viewRemind(record)">查看</a-button>
                        <a-button type="link" size="small" danger @click="deleteRemind(record)">删除</a-button>
                    </a-space>
                </template>
            </template>
            <template #emptyText>
                <div style="text-align: center; padding: 20px;">
                    <p>暂无提醒记录</p>
                    <p>点击右上角"新增提醒"按钮创建提醒</p>
                </div>
            </template>
        </a-table>
    </a-modal>

    <AddRemindModal 
        v-model:model-visible="addRemindModal" 
        :project-id="projectId"
        :project-type="projectType"
        @confirm="loadRemindData"
        v-on:update:model-visible=" addRemindModal = false">
    </AddRemindModal>
</template>

<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue';
import AddRemindModal from '@/components/Remind/addRemindModal.vue';
import { message, Modal } from 'ant-design-vue';
import { useStore } from 'vuex';
import ProjecrDao from '@/daos/project_dao';

const store = useStore();
const projectDao = new ProjecrDao();

// 项目信息
const projectId = store.getters.projectId;
const projectType = store.getters.projectType;

const props = defineProps({
    modelVisible: {
        type: Boolean,
        default: false
    },
});

const emit = defineEmits(['update:modelVisible']);

const visible = computed(() => {
    return ref(props.modelVisible)
});

const addRemindModal = ref(false);
const loading = ref(false);
const remindData = ref([]);

// 表格列定义
const columns = [
    {
        title: '提醒人',
        dataIndex: 'name',
        width: '20%',
    },
    {
        title: '提醒时间',
        className: 'column-money',
        dataIndex: 'money',
        width: '30%',
    },
    {
        title: '提醒方式',
        dataIndex: 'address',
        width: '20%',
    },
    {
        title: '操作',
        dataIndex: 'operation',
        width: '20%',
    },
];

// 加载提醒数据
const loadRemindData = async () => {
    loading.value = true;
    try {
        // 调用API获取提醒数据
        const result = await projectDao.getRemindList(projectId);
        if (result.data.code === 200) {
            remindData.value = result.data.data || [];
        } else {
            message.error(result.data.message || '加载提醒数据失败');
            remindData.value = [];
        }
    } catch (error) {
        console.error('加载提醒数据失败', error);
        message.error('加载提醒数据失败');
        remindData.value = [];
    } finally {
        loading.value = false;
    }
};

// 查看提醒
const viewRemind = (record) => {
    console.log('查看提醒', record);
    // 实现查看提醒功能
};

// 删除提醒
const deleteRemind = async (record) => {
    try {
        // 确认删除
        await new Promise((resolve, reject) => {
            Modal.confirm({
                title: '确认删除',
                content: '确定要删除这条提醒吗？',
                okText: '确认',
                cancelText: '取消',
                onOk: () => resolve(null),
                onCancel: () => reject(new Error('用户取消'))
            });
        });
        
        // 调用API删除提醒
        const result = await projectDao.deleteRemind(record.id);
        if (result.data.code === 200) {
            message.success('删除成功');
            loadRemindData();
        } else {
            message.error(result.data.message || '删除失败');
        }
    } catch (error) {
        if (error.message !== '用户取消') {
            console.error('删除提醒失败', error);
            message.error('删除提醒失败');
        }
    }
};

// 当模态框打开时加载数据
watch(() => props.modelVisible, (newVal) => {
    if (newVal) {
        loadRemindData();
    }
});

// 组件挂载时初始化
onMounted(() => {
    if (props.modelVisible) {
        loadRemindData();
    }
});
</script>
